import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { useTheme } from '@react-navigation/native';
import BottomTabStack from './tabStack';
import HomeRouteConfig from '@/screens/Home/routeConfig';

const Stack = createStackNavigator();

function HomeStack(props) {
  const { colors } = useTheme();
  return (
    <Stack.Navigator
      headerMode="screen"
      screenOptions={{
        headerStyle: { backgroundColor: colors.primary },
        headerTitleStyle: { color: colors.card },
        headerTintColor: colors.card,
      }}
    >
      <Stack.Screen
        name="HOME_TABS"
        component={BottomTabStack}
        options={{ headerShown: false, title: '主页' }}
      />
      {HomeRouteConfig.filter((hrc) => hrc.component).map((hrc) => (
        <Stack.Screen
          key={hrc.component.routeName}
          name={hrc.component.routeName}
          component={hrc.component}
          options={{ title: hrc.title }}
        />
      ))}
    </Stack.Navigator>
  );
}

HomeStack.routeName = 'HomeStack';
export default HomeStack;
